<template>
  <div class="w-full h-full">{{ data.num }}</div>
</template>

<script setup>
import { reactive, onMounted } from "vue";

const data = reactive({
  num: 0,
});

onMounted(() => {
  let importObject = {
    imports: {
      imported_func: (arg) => {
        data.num = arg;
      },
    },
  };

  fetch("./wasm/simple.wasm")
    .then((response) => response.arrayBuffer())
    .then((bytes) => WebAssembly.instantiate(bytes, importObject))
    .then((results) => {
      results.instance.exports.exported_func();
    });
});
</script>
